import { defineStore } from "pinia";
import piniaPersistConfig from "@/config/piniaPersist";
import router from "@/router/index";
import { effectRouter } from "@/router/staticRouter";
import { RouteRecordRaw } from "vue-router";
import type { Route } from "ant-design-vue/es/breadcrumb/Breadcrumb";

/* tabsMenuProps */
export interface TabsMenuProps {
    icon: string;
    title: string;
    path: string;
    name: string;
    close: boolean;
}

export interface Breadcrumbs {
    title: string;
    path: string;
}

/* TabsState */
export interface TabsState {
    tabsMenuList: TabsMenuProps[];
    effectRouter: RouteRecordRaw[];
    breadcrumbs: Route[];
}

// TabsStore
export const useTabsStore = defineStore({
    id: "TabsState",
    state: (): TabsState => ({
        tabsMenuList: [],
        effectRouter: effectRouter,
        breadcrumbs: []
    }),
    actions: {
        // Add breadcrumbs
        addBreadcrumbs(path: string[]) {
            const route = this.effectRouter.find(item => item.path === path[0]);
            if (route) {
                const _breadcrumbs: Route[] = [];
                _breadcrumbs.push({
                    breadcrumbName: route.meta?.title as string,
                    path: route.path,
                    children: [] as any
                });
                if (route.children && _breadcrumbs[0].children) {
                    for (const item of route.children) {
                        _breadcrumbs[0].children.push({
                            breadcrumbName: item.meta?.title as string,
                            path: item.path
                        });
                    }
                }
                if (route.children) {
                    const childrenRoute = route.children.find(item => item.path === path[1]);
                    _breadcrumbs.push({
                        breadcrumbName: childrenRoute?.meta?.title as string,
                        path: childrenRoute?.path as string
                    });
                }
                this.breadcrumbs.length = 0;
                this.breadcrumbs.push(..._breadcrumbs);
            }
        },
        // Add Tabs
        async addTabs(tabItem: TabsMenuProps) {
            if (this.tabsMenuList.every(item => item.path !== tabItem.path)) {
                this.tabsMenuList.push(tabItem);
            }
        },
        // Remove Tabs
        async removeTabs(tabPath: string, isCurrent: boolean = true) {
            const tabsMenuList = this.tabsMenuList;
            if (isCurrent) {
                tabsMenuList.forEach((item, index) => {
                    if (item.path !== tabPath) return;
                    const nextTab = tabsMenuList[index + 1] || tabsMenuList[index - 1];
                    if (!nextTab) return;
                    router.push(nextTab.path);
                });
            }
            this.tabsMenuList = tabsMenuList.filter(item => item.path !== tabPath);
        },
        // Close MultipleTab
        async closeMultipleTab(tabsMenuValue?: string) {
            this.tabsMenuList = this.tabsMenuList.filter(item => {
                return item.path === tabsMenuValue || !item.close;
            });
        },
        // Set Tabs
        async setTabs(tabsMenuList: TabsMenuProps[]) {
            this.tabsMenuList = tabsMenuList;
        },
        // Set Tabs Title
        async setTabsTitle(title: string) {
            const nowFullPath = location.hash.substring(1);
            this.tabsMenuList.forEach(item => {
                if (item.path == nowFullPath) item.title = title;
            });
        }
    },
    persist: piniaPersistConfig("TabsState")
});
